import 'package:film/controller/message_controller.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

/// 留言页面
class MessageScreen extends StatelessWidget {
  MessageScreen({Key? key}) : super(key: key);

  final MessageController controller = Get.put(MessageController());

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        backgroundColor: Colors.red,
        leading: IconButton(
          icon: const Icon(Icons.arrow_back, color: Colors.white),
          onPressed: () => Get.back(),
        ),
        centerTitle: true,
        title: const Text(
          '留言',
          style: TextStyle(color: Colors.white, fontSize: 22),
        ),
        elevation: 0,
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            TextField(
              maxLines: 6,
              maxLength: controller.maxLength,
              controller: controller.messageController,
              onChanged: (value) => controller.message.value = value,
              decoration: const InputDecoration(
                hintText: '请输入留言内容',
                border: InputBorder.none,
                counterText: '',
                hintStyle: TextStyle(color: Colors.grey, fontSize: 16),
                filled: true,
                fillColor: Color(0xFFF5F5F5),
                contentPadding: EdgeInsets.symmetric(vertical: 16, horizontal: 8),
              ),
              style: const TextStyle(fontSize: 16),
            ),
            Obx(
              () => Align(
                alignment: Alignment.centerRight,
                child: Text(
                  "${controller.message.value.length}/${controller.maxLength}",
                  style: const TextStyle(color: Colors.grey, fontSize: 15),
                ),
              ),
            ),
            const SizedBox(height: 24),
            SizedBox(
              width: double.infinity,
              height: 56,
              child: ElevatedButton(
                style: ElevatedButton.styleFrom(
                  backgroundColor: Colors.red,
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(4),
                  ),
                ),
                onPressed: controller.submitMessage,
                child: const Text('留言', style: TextStyle(fontSize: 20, color: Colors.white)),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
